<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div data-my-data="my-data" data-myData="myData"></div>

  <script>
    /**
     * elem.dataset
     *  ● 访问自定义属性
     */
    const elem = document.querySelector('div')

    // data-my-data → elem.dataset.myData
    // 获取
    console.log(elem.dataset.myData)
    // 修改
    elem.dataset.myData += ' 2'

    // data-myData → elem.dataset.mydata
    // 获取
    console.log(elem.dataset.mydata)
    // 修改
    elem.dataset.mydata += ' 2'
  </script>
</body>

</html>